<template>
  <div class="container">
    <el-row class="">
      <el-col :span="16" align="left">
        <el-input clearable v-model="search.name" placeholder="著作名称" style="width: 120px; margin-right: 15px" >
        </el-input>
        <el-select clearable v-model="search.maintainUnitId" placeholder="维护单位" >
          <el-option :label="item.belongingUnit" :value="item.belongingCode" :key="item.belongingCode"
            v-for="item in unitNameList" />
        </el-select>
        <el-select clearable v-model="search.workLevelId" placeholder="著作级别"  >
          <el-option :label="item.itemText" :value="item.itemValue" :key="item.itemValue" v-for="item in workList" />
        </el-select>
        <el-select clearable v-model="search.pyear" placeholder="年份" >
          <el-option :label="item.itemText" :value="item.itemValue" :key="item.itemValue" v-for="item in yearList" />
        </el-select>

        <el-button class="ordinary" @click="getTableList">搜索</el-button>
      </el-col>
      <el-col :span="8" align="right">
        <el-button class="unlock" @click="getUnlockBtn()">解锁</el-button>
        <el-button class="lock" @click="getLockBtn()">锁定</el-button>
        <el-button class="ordinary" @click="getExportBtn()">批量导出</el-button>
        <el-button type="danger" @click="handleDetect()">批量删除</el-button>
        <el-button type="primary" @click="handleAdd()">新增</el-button>
      </el-col>
    </el-row>
    <div>
      <Table :loading="isLoading" :tableArr="tableDate" :pagination="pagination.page" :columns="columns"
        :total="pagination.total" @delectTable="delectIds">
        <template #operate="{ row }">
          <el-button size="small" class="ordinary" :key="row.id + 'bj'" :disabled="row.isLock == 1"
            @click="handleEdit(row)">编辑</el-button>
          <el-button size="small" class="ordinary" :key="row.id + 'bj'"
                     @click="handleDetail(row)">详情</el-button>
          <el-button v-if="row.status == '待确认'" size="small" type="primary" :key="row.id + 'qr'"
            :disabled="row.isLock == 1" @click="handleConfirm(row)">确认</el-button>
        </template>
      </Table>
    </div>
    <InfoDialog :dialogVisable="infoDialog" :id="id" :flag="flag" @changeDialog="changeDialog"></InfoDialog>
    <InfoDialogxq :dialogVisablexq="infoDialogxq" :id="id" :flag="flag" @changeDialog="changeDialogxq"></InfoDialogxq>
  </div>
</template>
<script>
import {
getConfirm,
getDelect,
getDictionary,
getExport,
getLock,
getTable,
getUnit,
getUnlock
} from "@/views/science/api/academic";
import SelectOption from "@/views/science/components/selectOption/index.vue";
import Table from "@/views/science/components/table/table.vue";
import { Modals, tips } from "@/views/science/components/tips/tips";
import InfoDialog from "@/views/science/payoffs/composition/InfoDialog.vue";
import InfoDialogxq from "@/views/science/payoffs/composition/InfoDialogxq.vue";
import { onMounted, reactive, toRefs } from "vue";
import { useStore } from "vuex";
import tableHead from "./tableHeader.json";

export default {
  components: {
    SelectOption,
    Table,
    InfoDialog,
    InfoDialogxq,
  },
  setup() {
    const store = useStore();

    // 发送请求
    onMounted(() => {
      // 获取数据字典
      getCodeList();
      // 获取单位
      getUnitList();
      // 列表信息table
      getTableList();
    });

    let data = reactive({
      id: '',
      flag: 1,
      infoDialog: false,
      ids: [],

      pagination: { page: 1, pageSize: 10, total: 0 }, //分页

      isLoading: false,

      unitNameList: [], //维护单位

      workList: [], //软著状态

      yearList: [
        { itemText: '2023年', itemValue: 2023 },
        { itemText: '2022年', itemValue: 2022 },
        { itemText: '2021年', itemValue: 2021 },
        { itemText: '2020年', itemValue: 2020 },
        { itemText: '2019年', itemValue: 2019 }
      ],//年份
      tableDate: [],
      columns: tableHead.compositionHeader,
      search: {
        name: "",
        maintainUnitId: "",
        workLevelId: "",
        pyear: '',
      },
      infoDialogxq:false,
    });

    // 解锁
    let getUnlockBtn = async () => {
      if (data.ids.length == 1) {
        Modals("是否解锁选择内容", "提示", "warning")
          .then(async () => {
            let res = await getUnlock(data.ids);
            if (res.data.success) {
              tips("解锁成功", "success");
              getTableList();
            }
          })
          .catch(() => {
            console.log("点击了取消");
          });
      } else if (data.ids.length == 0) {
        tips("请选择", "warning");
      } else {
        tips("解锁功能不可批量操作", "warning");
      }
    };
    //  锁定
    let getLockBtn = async () => {
      if (data.ids.length == 1) {
        Modals("是否锁定选择内容", "提示", "warning")
          .then(async () => {
            let res = await getLock(data.ids);
            if (res.data.success) {
              tips("锁定成功", "success");
              getTableList();
            }
          })
          .catch(() => {
            console.log("点击了取消");
          });
      } else if (data.ids.length == 0) {
        tips("请选择", "warning");
      } else {
        tips("锁定功能不可批量操作", "warning");
      }
    };

    // 导出功能的实现

    let getExportBtn = () => {

      Modals('是否导出全部数据', '提示', 'warning').then(async () => {
        await getExport(data.search, '学术著作')
      }).catch(() => {
        console.log("点击了取消")
      })
    }
    // 确定当前流程
    let handleConfirm = async (row) => {
      Modals("是否确认当前流程", "提示", "warning")
        .then(async () => {
          let res = await getConfirm(row.id);
          if (res.data.success) {
            getTableList();
          }
        })
        .catch(() => { });
    };

    // 批量删除

    const handleDetect = async () => {
      if (data.ids.length) {
        Modals("是否删除选择内容", "提示", "warning")
          .then(async () => {
            let res = await getDelect(data.ids);
            if (res.data.success) {
              tips("删除成功", "success");
              getTableList();
            }
          })
          .catch(() => {
            console.log("点击了取消");
          });
      } else {
        tips("请选择", "warning");
      }
    };

    // 获取列表信息
    let getTableList = () => {
      (data.isLoading = true),
        getTable({
          current: data.pagination.page,
          size: data.pagination.pageSize,
          ...data.search,
        }).then((res) => {
          (data.tableDate = res.data.data.records),
            (data.pagination.total = res.data.data.total);
          data.isLoading = false;
        });
    };



    // 获取ids

    let delectIds = (ids) => {
      data.ids = ids;
    };

    // 人员列表
    let getUnitList = () => {

      getUnit({}).then((res) => {

        data.unitNameList = res.data.data;
      });
    };

    // 著作级别
    let getCodeList = () => {
      getDictionary(["KJSL_ACADEMIC_WORK_LEVEL"]).then((res) => {
        data.workList = res.data.data.KJSL_ACADEMIC_WORK_LEVEL;
      });
    };

    // 新增
    let handleAdd = () => {

      data.flag = 1


      data.infoDialog = true
    };
    // 编辑

    let handleEdit = (row) => {

      data.flag = 2
      data.id = row.id
      data.infoDialog = true

    }
    let handleDetail = (row) => {

      data.flag = 2
      data.id = row.id
      data.infoDialogxq = true

    }
    let changeDialogxq = (value) => {

      data.id = ''
      data.flag = 1

      if (value) {
        data.pagination.page = 1
        getTableList()
      }


      // 分页刷新列表
      data.infoDialogxq = false
    }

    let changeDialog = (value) => {

      data.id = ''
      data.flag = 1

      if (value) {
        data.pagination.page = 1
        getTableList()
      }


      // 分页刷新列表
      data.infoDialog = false
    }

    return {
      ...toRefs(data),
      store,
      handleEdit,
      handleAdd,
      changeDialog,
      getTableList,
      getLockBtn,
      getExportBtn,
      getUnlockBtn,
      delectIds,
      handleConfirm,
      handleDetect,
      changeDialogxq,
      handleDetail,
    };
  },
};
</script>
<style lang="scss" scoped>
.container {
  background-color: white;
  padding: 20px;
}
</style>
